import React, { Component } from "react";
import propTypes from "prop-types";

class XiaojiejieItem extends Component {
  constructor(props) {
    super(props);
    this.deleteItem = this.deleteItem.bind(this);
  }

  /* 
  // 组件第一次存在于DOM中，不会被执行
  // 如果已经存在于DOM中，才会被执行
  componentWillReceiveProps(){
    console.log('zujian ');
  }
  componentWillUnmount(){
    console.log('卸载组件');
  } */

  render() {
    console.log('child --- ');
    return (
      <li onClick={this.deleteItem}>
        {this.props.name} PK {this.props.content}
      </li>
    );
  }
  // 删除
  deleteItem() {
    this.props.deleteItem(this.props.index);
  }
}

XiaojiejieItem.propTypes = {
  name: propTypes.string.isRequired,
  content: propTypes.string,
  index: propTypes.number,
  deleteItem: propTypes.func,
};
XiaojiejieItem.defaultProps = {
  name: "Alomy",
};

export default XiaojiejieItem;
